<template>
	<div class="newsListPanel">
		<el-table
    :data="newsList"
    style="width: 100%;"
    height="338"
    border
    :row-class-name="tableRowClassName">
    <el-table-column
      prop="no" 
      label="序号" 
      width="60">
    </el-table-column>
    <el-table-column
      prop="title"
      label="文件标题" >
    </el-table-column>
    <el-table-column
      prop="pubdate"
      label="发表日期"
      width="160">
    </el-table-column>
  </el-table>
	</div>
</template>

<script>
	export default{
     methods: {
      tableRowClassName({row, rowIndex}) {
        if (rowIndex === 1) {
          return 'warning-row';
        } else if (rowIndex === 3) {
          return 'success-row';
        }
        return '';
      }
     },
     data(){
     	return {
     		newsList:[
     		  {no:"1",title:"这是一个活动资料手册1",pubdate:"2024-08-21 18:18:18"},
     		  {no:"2",title:"这是一个活动资料手册2",pubdate:"2024-08-22 18:18:18"},
     		  {no:"3",title:"这是一个活动资料手册3",pubdate:"2024-08-23 18:18:18"},
     		  {no:"4",title:"这是一个活动资料手册4",pubdate:"2024-08-24 18:18:18"},
     		  {no:"5",title:"这是一个活动资料手册5",pubdate:"2024-08-25 18:18:18"},
     		  {no:"6",title:"这是一个活动资料手册6",pubdate:"2024-08-26 18:18:18"},
     		]
     	}
     }
	}
</script>

<style>
   .el-table .warning-row {
    background: oldlace;
  }

  .el-table .success-row {
    background: #f0f9eb;
  }
</style>